<template>
  <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
    <h2 class="sub-header">添加留言</h2>
    <div class="form-group">
      <label for="name">姓名</label>
      <input
        type="text"
        class="form-control"
        id
        v-model="info.name"
        name="name"
        required
        minlength="2"
        maxlength="10"
        placeholder="请输入姓名"
      />
    </div>
    <div class="form-group">
      <label for>内容</label>
      <textarea
        class="form-control"
        type="text"
        rows="10"
        id
        v-model="info.msg"
        placeholder="请输入留言内容"
        name="msg"
        required
      ></textarea>
    </div>
    <button @click="doSubmit" class="btn btn-primary" to="/msg">提交</button>
  </div>
</template>
<script>
import { Toast } from "mint-ui";
export default {
  data() {
    return {
      info: {}
    };
  },
  methods: {
    doSubmit() {
      if (!this.info.name) {
        Toast({
          message: "请输入姓名！",
          position: "middle",
          duration: 1000,
          iconClass: "glyphicon glyphicon-remove"
        });
        return false;
      }
      if (!this.info.msg) {
        Toast({
          message: "请输入消息！",
          position: "middle",
          duration: 1000,
          iconClass: "glyphicon glyphicon-remove"
        });
        return false;
      } else {
        var formData = JSON.stringify(this.info);
        this.$http.post("/msg/new", formData).then(() => {
          this.$parent.getInfos();
          Toast({
            message: "添加留言成功！",
            position: "middle",
            duration: 1000,
            iconClass: "glyphicon glyphicon-ok"
          });
          this.$router.push("/msg");
        });
      }
    }
  }
};
</script>
<style>
</style>